<!DOCTYPE html>
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
<html>

	<head>
		<meta charset="UTF-8">
		<title>changePwd</title>
		<link rel="stylesheet" type="text/css" href="../../../css/bootstrap.min.css" />
		<script type="text/javascript" src="../../js/jquery-2.2.3.min.js"></script>
    	<script type="text/javascript" src="../../js/itnetcao.js"></script>
		
		<style type="text/css">
			* {
				margin: 0px;
				padding: 0px;
        font-family:"微软雅黑"
			}

			.head {
				background-color: #FFB800;
				width: 100%;
				margin: 0px auto;
				height: 1.8rem;
				line-height: 0.60rem;
				padding-bottom: 0.2rem;
				border-bottom: 0.15rem solid rgba(0, 0, 0, 0.1);
			}

			.logo {
				margin-top: 0.6rem;
				font-size: 0.6rem;
				vertical-align: middle;
				color: rgba(0, 0, 0, 0.3);
			}

			.head #span {
				vertical-align: middle;
				font-weight: bold;
				font-size: 0.5rem;
				color: #000000;
				position: relative;
				top: 0.3rem;
				left: 3.5rem;
			}
			.div-pwd {
				font-size: 0.5rem;
				text-align: left;
				width: 100%;
				border-bottom: 0.2rem solid rgba(0,0,0,0.1);
			}
				.div-pwd table td {
					text-align: center;
					padding: 0.3rem;
					height: 1.7rem;
					width: 20%;
					border-bottom: 1px solid rgba(0,0,0,0.1);
				}
				.text-oldpwd{
					border: 0;
					height: 1rem;
					border-radius: calc(2px);
				}
		.div-btn{
			width: 80%;
			margin: 0px auto;
			margin-top: 1rem;
		}
		#btnOK{
			font-size: 0.5rem;
			width: 100%;
			height: 1.5rem;
			background-color: #FFB800;
			border: none;

		}
		</style>
	</head>

	<body>
		<div class="head">
			<span onclick="history.back(-1)" class="glyphicon glyphicon-menu-left logo"></span>
			<span id="span">修改密码</span>
		</div>
		<div class="div-pwd">
			<table>
				<tr>
					<td >原密码</td>
					<td>
						<input class="text-oldpwd orgPassword" type="password" placeholder="手机号码" required="required"/>
					</td>
				</tr>
			</table>
		</div>
		<div class="div-pwd">
			<table>
				<tr>
					<td >新密码</td>
					<td>
						<input class="text-oldpwd newPassword" type="password" placeholder="请输入新密码" required="required"/>
					</td>
				</tr>
			</table>
		</div>
		<div class="div-pwd">
			<table>
				<tr>
					<td>确认密码</td>
					<td>
						<input class="text-oldpwd" type="password" placeholder="请重复输入新密码" required="required"/>
					</td>
				</tr>
			</table>
		</div>
		<div class="div-btn">
			<input id="btnOK" type="button" value="确定" />
		</div>
		<script type='text/javascript'>
		$(function() {
			$("#btnOK").click(function() {
				if($(".orgPassword").val().trim().length == 0) {
					alert("请输入原密码.");
					return;
				}
				if($(".newPassword").val().trim().length == 0) {
					alert("请输入新密码.");
					return;
				}
				if($(".newPassword").val().trim().length < 5) {
					alert("新的密码长度必须大于5");
					return;
				}
				if($(".newPassword").val().trim() != $(".newPassword").val().trim()) {
					alert("两次输入的新密码不一致.");
					return;
				}
				
				
				
				
			})
		})
		</script>
		<script>
			(function() {
				var supportsOrientationChange = 'onorientationchange' in window ? 'orientationchange' : 'resize';
				var timeoutId;

				function setRem() {
					var clientWidth = document.documentElement.clientWidth;
					var nowPX = clientWidth / 1024 * 100;
					document.documentElement.style.fontSize = nowPX + 'px';
				}
				setRem();
				window.addEventListener(supportsOrientationChange, function() {
					clearTimeout(timeoutId);
					timeoutId = setTimeout(function() {
						setRem();
					}, 300);
				}, false);
			})();
		</script>
	</body>

</html>
